<template>
  <div>
    <van-search
      v-model="keyword"
      shape="round"
      background="white"
      placeholder="请输入课程名搜索"
      @input="onSearch"
    />

    <van-cell
    style="borderBottom:1px solid #ccc"
      @click="onClick(index)"
      v-for="(item, index) in filList"
      :key="index"
      :title="item.name"
      :label="item.time"
    >
      <template #right-icon>
        <van-button @click="out(index)" size="mini" type="info"
          >发布</van-button
        >
      </template>
    </van-cell>
  </div>
</template>


<script>
export default {
  data() {
    return {
      keyword:"",
      filList:[],
      list: [
        {
          name: "第一章作业",
          time: "2022.03.01",
        },
        {
          name: "第二章作业",
          time: "2022.03.02",
        },
        {
          name: "第三章作业",
          time: "2022.03.03",
        },
      ],
    };
  },
  watch:{
    keyword:{
      immediate:true,
      handler(val){
        this.filList = this.list.filter((item) => {
          return item.name.indexOf(val) != -1
        })
      }
    }
  },
  methods: {
    onClick(i) {
      event.stopPropagation();
      console.log(i);
    },
    onSearch(){

    },
    out(i) {
      event.stopPropagation();
      console.log(i);
    },
  },
};
</script>

<style scoped>
</style>